<hr/>
<div class="row-fluid">
    <div class="span12">
        <a class="btn btn-info" id="btn_addBrand" href="${request.contextPath}/product/brandDetail"><i class="icon icon-plus"></i> 添加品牌</a>
        <a class="btn btn-info" id="btn_addCatalog" href="${request.contextPath}/product/catalogDetail"><i class="icon icon-plus"></i> 添加类型</a>
        <a class="btn btn-info" id="btn_addInfo" href="${request.contextPath}/product/infoDetail"><i class="icon icon-plus"></i> 添加商品</a>
        <a class="btn btn-info" id="btn_refresh" href="${request.contextPath}/product/infoList"><i class="icon icon-refresh"></i> 刷新</a>
    </div>
</div>
<div class="row-fluid">
    <div class="span3">
        <div class="widget-box">
            <div class="widget-title">
                <span class="icon"><i class="icon-reorder"></i></span>
                <h5>商品类型</h5>
            </div>
            <div class="widget-content">
                <div class="todo">
                    <ul>
                        <#list catalogList as catalog>
                            <li class="clearfix">
                                <div class="txt">${catalog.catalogName}</div>
                                <div class="pull-right">
                                    <a href="${request.contextPath}/product/catalogDetail?catalogId=${catalog.productCatalogId}" class="btn_edit"><i class="icon icon-pencil"></i></a>
                                    <a href="${request.contextPath}/product/deleteCatalog?catalogId=${catalog.productCatalogId}" class="btn_remove"><i class="icon icon-remove"></i></a>
                                </div>
                            </li>
                        </#list>
                    </ul>
                </div>
            </div>
        </div>
        <div class="widget-box">
            <div class="widget-title">
                <span class="icon"><i class="icon-reorder"></i></span>
                <h5>商品品牌</h5>
            </div>
            <div class="widget-content">
                <div class="todo">
                    <ul>
                        <#list brandList as brand>
                            <li class="clearfix">
                                <div class="txt">${brand.brandName}</div>
                                <div class="pull-right">
                                    <a href="${request.contextPath}/product/brandDetail?brandId=${brand.productBrandId}" class="btn_edit"><i class="icon icon-pencil"></i></a>
                                    <a href="${request.contextPath}/product/deleteBrand?brandId=${brand.productBrandId}" class="btn_remove"><i class="icon icon-remove"></i></a>
                                </div>
                            </li>
                        </#list>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="span9">
        <div class="widget-box">
            <div class="widget-title">
                <span class="icon"><i class="icon-table"></i></span>
                <h5>商品列表</h5>
            </div>
            <div class="widget-content nopadding">
                <table class="table table-bordered table-striped data-table">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>商品编号</th>
                        <th>商品名称</th>
                        <th>类型</th>
                        <th>品牌</th>
                        <th>当前库存</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <#list productList as product>
                        <tr id="tr_${product.productId}">
                            <td>${product_index + 1}</td>
                            <td>${product.productCode}</td>
                            <td>${product.productName}</td>
                            <td>${product.catalog.catalogName}</td>
                            <td>${product.brand.brandName}</td>
                            <td>${product.stockAmount}</td>
                            <td>
                                <a class="btn_edit" href="${request.contextPath}/product/infoDetail?productId=${product.productId}"><i class="icon icon-pencil"></i></a>
                                <a class="btn_delete" href="#" data-key="${product.productId}"><i class="icon icon-remove"></i></a>
                            </td>
                        </tr>
                    </#list>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<script src="${request.contextPath}/js/jquery-1.12.2.min.js"></script>
<script src="${request.contextPath}/js/jquery.dataTables.min.js"></script>
<script src="${request.contextPath}/js/sweetalert.min.js"></script>
<script type="text/javascript">

    $(function(){

        loadData();

        $("#btn_addBrand").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("#btn_addCatalog").click(function(){
            loadPage($(this).attr("href"));
            return false;
        })

        $(".btn_edit").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("#btn_addInfo").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("#btn_refresh").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $('.data-table').on( 'draw.dt', function () {
            $(".btn_edit").unbind("click");
            $(".btn_edit").click(function(){
                loadPage($(this).attr("href"));
                return false;
            });

            $(".btn_delete").unbind("click");
            $(".btn_delete").click(function(){
                var productId = $(this).attr("data-key");
                swal({
                    title: "信息提示",
                    text: "真的要删了它？",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonText: "是的",
                    cancelButtonText: "算了",
                    closeOnConfirm: false
                },
                function(isConfirm){
                    if(isConfirm){
                        deleteItem(productId);
                    }
                });
                return false;
            });
        });

        $("td > .btn_delete").click(function(){
            var productId = $(this).attr("data-key");
            swal({
                title: "信息提示",
                text: "真的要删了它？",
                type: "warning",
                showCancelButton: true,
                confirmButtonText: "是的",
                cancelButtonText: "算了",
                closeOnConfirm: false
            },
            function(isConfirm){
                if(isConfirm){
                    deleteItem(productId);
                }
            });
            return false;
        });

        $(".btn_remove").click(function(){
            var url = $(this).attr("href");
            var li = $(this).parent().parent();
            swal({
                title: "信息提示",
                text: "真的要删了它？",
                type: "warning",
                showCancelButton: true,
                confirmButtonText: "是的",
                cancelButtonText: "算了",
                closeOnConfirm: false
            },
            function(isConfirm){
                if(isConfirm){
                    $.post(url, function(result){
                        swal({
                            title: "信息提示",
                            text: result.status == "success" ? "恭喜，操作已完成！" : "很遗憾，操作失败了！",
                            type: result.status,
                            animation: "slide-from-top",
                            closeOnConfirm: true
                        }, function(){
                            if (result.status == "success"){
                                li.remove();
                            }
                        });
                    });
                }
            });
            return false;
        });
    });

    function deleteItem(itemId){
        $.ajax({
            url: "${request.contextPath}/product/deleteProduct",
            type: "post",
            data: {
                productId: itemId
            },
            success: function(result){
                swal({
                    title: "信息提示",
                    text: result.status == "success" ? "恭喜，操作已完成！" : "很遗憾，操作失败了！",
                    type: result.status,
                    animation: "slide-from-top",
                    closeOnConfirm: true
                }, function(){
                    if (result.status == "success"){
                        $("#tr_" + itemId).remove();
                    }
                });
            }
        });
    }

    function loadData(){
        $(".data-table").dataTable({
            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "sDom": '<""l>t<"F"fp>'
        });
    }

</script>